<template>
  <div class="form-action">
    <div class="form-action-left">
      <ActionList ref="ActionList" :formDefinition="formDefinition" v-model="action" :actions="actions"/>
    </div>
    <div class="form-action-right">
      <div class="form-action-right-content">
        <FieldActionEditor @addNew="() => $refs.ActionList.addNewAction()" :formDefinition="formDefinition"
                           :action="action"/>
      </div>
    </div>
  </div>
</template>
<script>
import ActionList from '@/components/hhd/design/FormAction/ActionList.vue';
import ActionUtils from '@/components/hhd/design/FormAction/ActionUtils';
import FieldActionEditor from '@/components/hhd/design/FormAction/FieldActionEditor.vue';
import {createProps} from '@/utils';

export default {
  name: 'FormAction',
  components: {FieldActionEditor, ActionList},
  props: {
    actions: createProps(Array),
  },
  data() {
    return {
      actionHelper: new ActionUtils(),
      action: undefined,
      formDefinition: undefined
    };
  },
  methods: {
    check(formDefinition) {
      this.formDefinition = formDefinition || this.formDefinition;
      return new Promise((success, err) => {
        this.actionHelper.refreshActions(this.actions, this.formDefinition);
        let list = this.actions || [];
        for (let i = 0; i < list.length; i++) {
          if (!list[i].actionName || list[i].actionName === '') {
            this.$notification.error({message: '操作权限名称不能为空!'})
            return;
          }
        }
        success();
      });
    },
    active(formDefinition) {
      this.formDefinition = formDefinition;
      this.actionHelper.refreshActions(this.actions, formDefinition);
    },
  }
};
</script>
<style>
.form-action {
  width: 100%;
  height: 100%;
  display: flex;
}

.form-action-left {
  width: 700px;
  padding: 10px;
  overflow: auto;
}

.form-action-right {
  flex: 1;
  padding: 10px;
  padding-left: 0px;
  overflow: auto;
}

.form-action-right-content {
  border: 1px solid #e2e4e9;
  height: 100%;
  width: 100%;
}
</style>